<template>
	<view>
		<view style="padding: 30upx;text-align: center;">
			<view>账户余额（元）</view>
			<view style="font-size: 60upx;margin-top: 50upx;margin-bottom: 50upx;">{{money}}</view>
			<button @click="navTo">查看提现记录</button>
		</view>


		<view class="row b-b">
			<text class="tit">提现金额：</text>
			<input class="input" type="number" v-model="reqAmount" placeholder="提现金额" placeholder-class="placeholder" />
		</view>
		<view class="row b-b">
			<text class="tit">真实姓名：</text>
			<input class="input" type="text" v-model="aliPayAccountName" placeholder="请输入真实姓名" placeholder-class="placeholder" />
		</view>
		<view class="row b-b">
			<text class="tit">支付宝账号：</text>
			<input class="input" type="text" v-model="aliPayAccountNo" placeholder-class="placeholder" />
		</view>
		<view class="row b-b">
			<text class="tit">备注：</text>
			<input class="input" type="text" v-model="fetMemo" placeholder-class="placeholder" />
		</view>

		<button :disabled="submitting" class="add-btn" @click="confirm">确认提交</button>
		<view style="text-align: center;color: #E93B3D;font-size: 35upx;"><text>{{info}}</text></view>
		<!-- 提现处理时间：早上9点至晚上10点。 -->
	</view>



</template>

<script>
	import {
		mapState,
	} from 'vuex';

	export default {
		data() {
			return {
				reqAmount: 0,
				aliPayAccountNo: '',
				aliPayAccountName: '',
				fetMemo: '',
				submitting: false,
				money: 0,
				info: '提现处理时间：早上9点至晚上10点。'
			}
		},
		computed: {
			...mapState(['token', 'exp_time', 'hasLogin', 'userInfo'])
		},
		onLoad() {
			console.log("onLoaduser")

			this.money = this.userInfo.BalanceProfits

			let _that = this

			uni.request({
				url: this.$serverUrl + `/app/balance/fetchAcc/` + this.userInfo.MemId,
				header: {
					"Content-Type": "application/json",
					"Authorization": this.token
				},
				data: {

				},
				method: "POST",
				success: (e) => {
					if (e.data.success) {
						console.log(e.data)

						let redata = e.data
						if (redata.rows != null) {
							_that.aliPayAccountName = redata.rows[0].FetBankAccName
							_that.aliPayAccountNo = redata.rows[0].FetBankAccNo

						}

					} else {
						console.log(e.data.message)
					}
				},
				fail: (e) => {
					console.log(e.errMsg)
				}
			})






			uni.request({
				url: this.$serverUrl + `/app/setting/BalanceFetchTips`,
				header: {
					"Content-Type": "application/json",
					"Authorization": this.token
				},
				data: {

				},
				method: "POST",
				success: (e) => {
					if (e.data.success) {
						console.log(e.data)

						let redata = e.data
						_that.info = redata.value


					} else {
						console.log(e.data.message)
					}
				},
				fail: (e) => {
					console.log(e.errMsg)
				}
			})
























		},
		onShow() {},
		methods: {
			navTo() {
				uni.navigateTo({
					url: '/pages/bill/bill'
				});
			},
			confirm() {
				if (this.submitting == true) {
					return
				}

				this.submitting = true


				uni.request({
					url: this.$serverUrl + '/app/balance/fetch',
					header: {
						"Content-Type": "application/json",
						"Authorization": this.token
					},
					data: {
						"mem_id": this.userInfo.MemId,
						"req_amount": Number(this.reqAmount),
						"ali_pay_account_no": this.aliPayAccountNo,
						"ali_pay_account_name": this.aliPayAccountName,
						"fet_memo": this.fetMemo
					},
					method: "POST",
					success: (e) => {

						let _this = this


						if (e.data.success) {

							uni.showModal({
								content: e.data.message,
								showCancel: false,
								success: function(res) {
									_this.submitting = false

									_this.money = Math.floor((_this.money - _this.reqAmount) * 100) / 100
									_this.mn = 0



								}
							})

						} else {

							uni.showModal({
								content: e.data.message,
								showCancel: false,
								success: function(res) {
									_this.submitting = false
									_this.mn = 0
								}
							})


						}
					},
					fail: (e) => {
						console.log(e.errMsg)
					}
				})

			},



		}
	}
</script>


<style lang="scss">
	page {
		background: $page-color-base;
		padding-top: 16upx;
	}

	.row {
		display: flex;
		align-items: center;
		position: relative;
		padding: 0 30upx;
		height: 110upx;
		background: #fff;

		.tit {
			flex-shrink: 0;
			width: 250upx;
			font-size: 30upx;
			color: $font-color-dark;
		}

		.input {
			flex: 1;
			font-size: 30upx;
			color: $font-color-dark;
		}

		.icon-shouhuodizhi {
			font-size: 36upx;
			color: $font-color-light;
		}
	}

	.default-row {
		margin-top: 16upx;

		.tit {
			flex: 1;
		}

		switch {
			transform: translateX(16upx) scale(.9);
		}
	}

	.add-btn {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 690upx;
		height: 80upx;
		margin: 60upx auto;
		font-size: $font-lg;
		color: #fff;
		background-color: $base-color;
		border-radius: 10upx;
		box-shadow: 1px 2px 5px rgba(219, 63, 96, 0.4);
	}
</style>
